<template>
	<view class="page-body">
		<!-- 页面内容开始 -->

		<!-- 表格搜索组件开始 -->
		<vk-data-table-query v-model="queryForm1.formData" :columns="queryForm1.columns"
			@search="search"></vk-data-table-query>
		<!-- 表格搜索组件结束 -->

		<!-- 自定义按钮区域开始 -->
		<view>
			<el-row>
				<el-button type="primary" size="small" @click="exporttable">导出查询</el-button>
				<!-- 批量操作 -->
				<!-- <el-dropdown v-if="table1.multipleSelection" :split-button="false" trigger="click" @command="batchBtn">
					<el-button type="danger" size="small" style="margin-left: 20rpx;"
						:disabled="table1.multipleSelection.length === 0">
						批量操作<i class="el-icon-arrow-down el-icon--right"></i>
					</el-button>
					<el-dropdown-menu slot="dropdown">
						<el-dropdown-item :command="1">批量操作1</el-dropdown-item>
						<el-dropdown-item :command="2">批量操作2</el-dropdown-item>
					</el-dropdown-menu>
				</el-dropdown> -->
			</el-row>
		</view>
		<!-- 自定义按钮区域结束 -->

		<!-- 表格组件开始 -->
		<vk-data-table ref="table1" :action="table1.action" :columns="table1.columns" :query-form-param="queryForm1"
			:right-btns="['detail_auto', 'more']" :selection="true" :row-no="true" :pagination="true" :show-summary="true"
			:total-option="[

				{ key: 'price', 'unit': '元', type: 'money', precision: 2 }
			]" :main-columns="['status', 'order_no', 'booth_id']" @current-change="currentChange" size="mini"
			@selection-change="selectionChange" :right-btns-more="table1.rightBtnsMore">

		</vk-data-table>
		<!-- 表格组件结束 -->

		<!-- 添加或编辑的弹窗开始 -->
		<vk-data-dialog v-model="form1.props.show" :title="form1.props.title" width="1000px" mode="form"
			:close-on-click-modal="false">
			<vk-data-form v-model="form1.data" :rules="form1.props.rules" :action="form1.props.action"
				:form-type="form1.props.formType" :columns='form1.props.columns' label-width="120px"
				@success="form1.props.show = false; refresh();"></vk-data-form>
		</vk-data-dialog>
		<!-- 添加或编辑的弹窗结束 -->

		<!-- 页面内容结束 -->
	</view>
</template>

<script>

var that;													// 当前页面对象
var vk = uni.vk;									// vk实例
var originalForms = {};						// 表单初始化数据
const statusData = [
	{ label: "已关闭", value: -1, tagType: "info" },
	{ label: "未支付", value: 0, tagType: "info" },
	{ label: "已支付", value: 1, tagType: "success" },
	{ label: "已部分退款", value: 2, tagType: "warning" },
	{ label: "已全额退款", value: 3, tagType: "danger" },
];
export default {
	keepAlive: true,
	data() {
		// 页面数据变量
		return {
			// 页面是否请求中或加载中
			loading: false,
			// init请求返回的数据
			data: {

			},
			con_show: false,
			contract_info: {

			}, contract_imgbase: '',
			// 表格相关开始 -----------------------------------------------------------
			table1: {
				// 表格数据请求地址
				action: "admin/bidding-orders/sys/getList",
				// 表格字段显示规则
				columns: [
					// { key: "button1", title: "操作", type: "text", width: 220, fixed: "right" },
					{
						key: "status", title: "状态", type: "tag", width: 160, sortable: "custom", show: ["detail", "row"],
						data: [
							{ value: -1, label: "超时关闭", tagType: "info" },
							{ value: 0, label: "拍下待签合同", tagType: "warning" },
							{ value: 1, label: "已签待付款", tagType: "primary" },
							{ value: 2, label: "成功租赁", tagType: "success" },
							{ value: 3, label: "已返还押金,订单关闭", tagType: "danger" }
						]
					},
					{ key: "_id", title: "订单id", type: "text", width: 160, sortable: "custom", show: ["detail"] },
					{
						key: "booth", title: "会场", type: "text", sortable: "custom", width: 200,
						formatter: (val, row, column, index) => {

							if (this.$fn.isNotNull(val)) {
								return val.place.name;
							}
						}
					},
					{ key: "booth_id", title: "展位ID", type: "text", width: 200, sortable: "custom", show: ["detail"] },
					{ key: "booth_name", title: "展位名称", type: "text", width: 160, sortable: "custom" },

					{ key: "price", title: "金额", type: "money", width: 160, sortable: "custom" },
					{ key: "_add_time", title: "创建时间", type: "date", width: 160, sortable: "custom" },
					{ key: "order_no", title: "流水号", type: "text", width: 200, sortable: "custom" },
					{ key: "userid", title: "用户id", type: "text", width: 200, sortable: "custom", show: ["detail"] },
					{ key: "userinfo.mobile", title: "手机号", type: "text", width: 150, sortable: "custom" },
					{
						key: "userinfo.realname", title: "订单用户名", width: 150, sortable: "custom" 				// 	formatter: (val, row, column, index) => {

						, type: "html",
						formatter: (val, row, column, index) => {
							let str = `<text style="color:green;">${val}</text>（正常）`;
							if (val != row.out_trade_no_info.userinfo.realname) {
								str = `<text style="color:red">${val}</text>（非支付用户）`;
							} else if (val != row.booth.biddingprice.userinfo.realname) {
								str = `<text style="color:red">${val}</text>（非最后竞拍用户）`;
							}
							return str;
						}
					},
					{ key: "out_trade_no_info.userinfo.realname", title: "实际支付用户名", type: "text", width: 150, sortable: "custom" },
					{ key: "booth.biddingprice.userinfo.realname", title: "最后竞拍用户名", type: "text", width: 150, sortable: "custom" },
					// {
					// 	key: "userinfo", title: "用户手机号", type: "text", sortable: "custom", width: 200,
					// 	formatter: (val, row, column, index) => {

					// 		if (this.$fn.isNotNull(val)) {
					// 			return val.mobile;
					// 		}
					// 	}
					// },
					{
						key: "userinfo", title: "用户详情", width: 200, type: "object", width: 400, align: "left",
						columns: [
							{ key: "_id", title: "用户id", type: "text" },
							{ key: "mobile", title: "手机号码", type: "text" },
							{ key: "realname", title: "真实姓名", type: "text" },
						], show: ["detail"]
					},
					{
						key: "out_trade_no_info", title: "租金详情", width: 200, type: "object", width: 400, align: "left",
						columns: [
							{ key: "_id", title: "租金id", type: "text" },
							{
								key: "status", title: "状态", type: "tag", width: 110,
								data: statusData
							},
							{ key: "nickname", title: "昵称", type: "text" },
							{ key: "description", title: "描述", type: "text" },
							{ key: "total_fee", title: "交易金额", type: "money" },
							{ key: "_add_time", title: "创建时间", type: "date" },
						], show: ["detail"]
					},
					{ key: "earnest_money_out_trade_no", title: "押金流水号", width: 200, type: "text", sortable: "custom" },
					{
						key: "earnest_money_out_trade_no_info", title: "押金详情", width: 200, type: "object", width: 400, align: "left",
						columns: [
							{ key: "_id", title: "押金id", type: "text" },
							{
								key: "status", title: "状态", type: "tag", width: 110,
								data: statusData
							},
							{ key: "nickname", title: "昵称", type: "text" },
							{ key: "description", title: "描述", type: "text" },
							{ key: "total_fee", title: "交易金额", type: "money" },
							{ key: "_add_time", title: "创建时间", type: "date" },
						], show: ["detail"]
					},
					{
						key: "contract_info", title: "合同信息", width: 200, type: "object", width: 400, align: "left",
						columns: [
							{ key: "_id", title: "合同id", type: "text" },
							{ key: "sign_url", title: "签名", type: "image" },
							{ key: "booth_no", title: "展位编号", type: "text" },
							{ key: "booth_name", title: "展位名称", type: "text" },
							{ key: "idcard", title: "身份证号码", type: "text" },
						], show: ["detail"]
					},



				],
				rightBtnsMore: [
					{
						title: '取消订单',
						show: (item) => {
							return item.status < 2 && item.status >= 1
						},
						onClick: (item) => {
							this.refunt(item)
						}
					},
					{
						title: '重新发送短信',
						show: (item) => {
							return item.status < 2 && item.status >= 1
						},
						onClick: (item) => {
							this.sendsms(item)
						}
					},
					{
						title: '查看合同',
						show: (item) => {
							return item.status == 2
						},
						onClick: async (item) => {
							this.con_show = true;
							this.contract_info = item.contract_info
							console.log(this.contract_info)
							const response = await fetch(this.contract_info.sign_url);
							const blob = await response.blob();
							const reader = new FileReader();

							reader.onload = () => {
								this.contract_imgbase = reader.result;
								//	console.log(this.contract_imgbase)
							};

							reader.readAsDataURL(blob);
							// vk.alert(item.contract_info.contract)
						}
					},
				],
				stripe: true,
				size: "mini",
				border: true,
				// 多选框选中的值
				multipleSelection: [],
				// 当前高亮的记录
				selectItem: ""
			},
			// 表格相关结束 -----------------------------------------------------------
			// 表单相关开始 -----------------------------------------------------------
			// 查询表单请求数据
			queryForm1: {
				// 查询表单数据源，可在此设置默认值
				formData: {

				},
				// 查询表单的字段规则 fieldName:指定数据库字段名,不填默认等于key
				columns: [
					{
						key: "status", title: "状态", type: "select", sortable: "custom", width: 120, size: "small",
						data: [
							{ value: -1, label: "超时关闭", tagType: "info" },
							{ value: 0, label: "拍下待签合同", tagType: "warning" },
							{ value: 1, label: "已签待付款", tagType: "primary" },
							{ value: 2, label: "成功租赁", tagType: "success" },
							{ value: 3, label: "已返还押金,订单关闭", tagType: "danger" }
						]
					},
					{ key: "userinfo.mobile", title: "用户手机", type: "text", width: 150, mode: '%%', lastWhereJson: true },
					{ key: "userinfo.real_name", title: "用户真实姓名", type: "text", width: 150, mode: '%%', show: ["drawer"] },
					{ key: "order_no", title: "流水号", type: "text", width: 150 },
					{ key: "booth.name", title: "展位名称", type: "text", width: 220, mode: '%%', lastWhereJson: true },
					{ key: "earnest_money_out_trade_no", title: "押金流水号", type: "text", width: 220, show: ["drawer"] },
					{ key: "userid", title: "用户id", type: "text", width: 220 },
					{ key: "_add_time", title: "添加时间", type: "datetimerange", width: 400, mode: "[]" },

				]
			},
			form1: {
				// 表单请求数据，此处可以设置默认值
				data: {

				},
				// 表单属性
				props: {
					// 表单请求地址
					action: "",
					// 表单字段显示规则
					columns: [

						{ key: "name", title: "摊位名称", type: "text", sortable: "custom" },
						{ key: "location", title: "摊位位置", type: "text", sortable: "custom" },

					],
					// 表单验证规则
					rules: {

					},
					// add 代表添加 update 代表修改
					formType: "",
					// 是否显示表单的弹窗
					show: false
				}
			},
			// 其他弹窗表单
			formDatas: {},
			// 表单相关结束 -----------------------------------------------------------
		};
	},
	// 监听 - 页面每次【加载时】执行(如：前进)
	onLoad(options = {}) {
		that = this;
		vk = that.vk;
		that.options = options;
		that.init(options);
	},
	// 监听 - 页面【首次渲染完成时】执行。注意如果渲染速度快，会在页面进入动画完成前触发
	onReady() { },
	// 监听 - 页面每次【显示时】执行(如：前进和返回) (页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面)
	onShow() { },
	// 监听 - 页面每次【隐藏时】执行(如：返回)
	onHide() { },
	// 函数
	methods: {
		// 页面数据初始化函数
		init(options) {
			originalForms["form1"] = vk.pubfn.copyObject(that.form1);
		},
		renderCanvas(e) {
			//console.log('==== renderCanvas :', e)
		},
		savePDF(e) {
			console.log('==== savePDF :', e)
			uni.showLoading({
				title: '导出中'
			})
			base64ToPath(e)
				.then((path) => {
					uni.openDocument({
						filePath: path,
						success: (res) => {
							console.log('==== openDocument res :', res)
						},
						fail: (err) => {
							console.log('==== openDocument err :', err)
						}
					})
				})
				.catch((error) => {
					console.error('base64ToPath error', error)
				})
				.finally(() => {
					uni.hideLoading()
				})
		},
		// 页面跳转
		pageTo(path) {
			vk.navigateTo(path);
		},
		// 表单重置
		resetForm() {
			vk.pubfn.resetForm(originalForms, that);
		},
		// 搜索
		search() {
			that.$refs.table1.search();
		},
		// 刷新
		refresh() {
			that.$refs.table1.refresh();
		},
		// 获取当前选中的行的数据
		getCurrentRow() {
			return that.$refs.table1.getCurrentRow();
		},
		// 监听 - 行的选中高亮事件
		currentChange(val) {
			that.table1.selectItem = val;
		},
		// 当选择项发生变化时会触发该事件
		selectionChange(list) {
			that.table1.multipleSelection = list;
		},
		// 监听 - 批量操作的按钮点击事件
		batchBtn(index) {
			switch (index) {
				case 1: vk.toast("批量操作按钮1"); break;
				case 2: vk.toast("批量操作按钮2"); break;
				default: break;
			}
		},
		exporttable() {
			this.$refs.table1.exportExcel({
				fileName: "用户订单",
				title: "正在导出数据...",
				pageIndex: 1,
				pageSize: -1, // 此值为-1，代表导出所有数据
			});
		},
		async refunt(order) {
			vk.confirm(`此操作不可逆,是否取消当前用户订单??`, (res) => {
				if (res.confirm) {
					vk.callFunction({
						url: 'admin/bidding-orders/sys/refundOrder',
						title: '请求中...',
						data: {
							_id: order._id,
						},
						success: async (data) => {
							vk.alert(data.msg)
							that.$refs.table1.refresh();
						}
					});
				}
			})

		},
	},
	// 监听属性
	watch: {

	},
	// 过滤器
	filters: {

	},
	// 计算属性
	computed: {

	}
};
</script>
<style lang="scss" scoped>
.page-body {}
</style>
